$.fn.extend({
    nav: function (url) {
        var me = $(this);
        $.getJSON(url, function (res) {
            var html = "";
            for (var i = 0; i < res.length; i++) {
                var data = res[i];
                if (data.href == "#") {
                    html += "<li>" +
                        "<a href='#' class='menu-dropdown'>" +
                        "<i class='" + data.icon + "'></i>" +
                        "<span class='menu-text'>" + data.title + "</span>" +
                        "<i class='menu-expand'></i>" +
                        "</a>";
                    var children = data.children;
                    html += "<ul class='submenu'>";
                    for (var j = 0; j < children.length; j++) {
                        var child = children[j];
                        if (child.href == "#") {
                            html += "<li>" +
                                "<a href='#' class='menu-dropdown'>" +
                                "<span class='menu-text'> " + child.title + " </span>" +
                                "<i class='menu-expand'></i>" +
                                "</a>";
                            html += '<ul class="submenu">'
                            for (var k = 0; k < child.children.length; k++) {
                                var child1 = child.children[k];
                                html += "<li>" +
                                    "<a href='javascript:$.showPage(\"" + child1.id + "\",\"" + child1.title + "\",\"" + child1.href + "\")'>" +
                                    "<i class='menu-icon fa fa-rocket'></i>" +
                                    "<span class='menu-text'>" + child1.title + "</span>" +
                                    "</a>" +
                                    "</li>";
                            }
                            html += "</li></ul>";
                        }
                        else {
                            html += "<li>" +
                                "<a href='javascript:$.showPage(\"" + child.id + "\",\"" + child.title + "\",\"" + child.href + "\")'>" +
                                "<span class='menu-text'> " + child.title + " </span>" +
                                "</a>" +
                                "</li>";
                        }
                    }
                    html += "</ul></li>";
                }
                else {
                    html += "<li>" +
                        "<a href='javascript:$.showPage(\"" + data.id + "\",\"" + data.title + "\",\"" + data.href + "\")'>" +
                        "<i class='" + data.icon + "'></i>" +
                        "<span class='menu-text'> " + data.title + " </span>" +
                        "</a>" +
                        "</li>";
                }
            }
            me.html("").html(html);

            me.on("click", "a", function () {
                if ($(this).attr("class") != "menu-dropdown") {
                    me.find("li").removeClass("active");
                    $.each($(this).parents("li"), function (index, item) {
                        $(item).addClass("active");
                    });
                }
            });
        });
    }
});